enyo.kind({
	name: "webFTP.Config",
	kind: enyo.Toaster,
	
	flyInFrom: "right",
	style: "top: 0px; bottom: 0px;",
	
	components: [
	    {className: "enyo-sliding-view-shadow"},
	    {kind: enyo.VFlexBox, name: "configToaster", flex: 1, width: "320px", height: "100%", 
	    	components: [
	    	    {kind: "Header", components: [
					{kind: "RadioGroup", flex: 1, components: [
						{kind: "RadioButton", value: "general", icon: "images/chrome/toaster-icon-general.png", onclick: "showGeneral"},
						{kind: "RadioButton", value: "advanced", icon: "images/chrome/toaster-icon-advanced.png", onclick: "showAdvanced"}
					]}
	    	    ]},
    			{name: "config", kind:"VFlexBox", flex:1, components: [
					{name: "drawerPane", kind: "Pane", flex: 1, lazyViews: [
					    {name: "general", kind: "VFlexBox", flex: 1, components: [
							{kind: "RowGroup", name: "hostRowID" ,caption: "Row ID", components: [ 
							    {name:"itemID", kind: "Input"}
							]},
							{kind: "RowGroup", caption: "Title", components: [ 
								{name:"title", kind: "Input", hint: "Enter a Title for the Connection"}
							]},
							{kind: "RowGroup", caption: "Host Name", components: [ 
								{name:"name", kind: "Input", hint: "yourhost.com"}
							]},
							{kind: "RowGroup", caption: "Connection Type", components: [
								{kind: "ListSelector", name: "type", value: "FTP",
									items: [
										{caption: "FTP File Transfer Protocol", value: "FTP"},
										{caption: "SFTP"}
									]
								},
							]},
							{kind: "RowGroup", caption: "Port Number", components: [ 
								{name:"port", kind: "Input", hint: "optional"}
							]},
							{kind: "RowGroup", caption: "User Name", components: [ 
								{name:"uid", kind: "Input", hint: "optional"}
							]},
							{kind: "RowGroup", caption: "Password", components: [ 
								{name:"pass", kind: "Input", hint: "optional"}
							]}					    
					    ]},
					    {name: "advanced", kind: "VFlexBox", flex: 1, components: [
 							{kind: "RowGroup", caption: "Local Directory", components: [ 
 								{name:"locdir", kind: "Input", hint: "/media/internals/"}
 							]},
 							{kind: "RowGroup", caption: "Remote Directory", components: [ 
 								{name:"remdir", kind: "Input", hint: "/yourfolder"}
 							]}					    
 					    ]}
					]}
				]},
				{kind: "Toolbar", components: [
					{kind: "GrabButton"}
				]}
			]
	    }
	],
	create: function() {
		this.inherited(arguments);

		this.$.configToaster.applyStyle("background-color", "enyo-bg");
		
		this.showGeneral();
		this.showAdvanced();
		
		this.configRec = {};
	},
	
	/**
	 * Setup method necessary for configuring a Host
	 *
	 * Parameters:
	 * - hostID (object, required): where the key is the table field and the value is it's value
	 * 
	 */
	configHost: function(inHost) {
		// Parse the hostID object if we have one
		if (typeof inHost !== 'undefined') {
			this.configRec = inHost;
			
			this.$.itemID.setValue(this.configRec.rowID);
			this.$.hostRowID.hide();
			
			this.$.title.setValue(this.configRec.title);
			this.$.name.setValue(this.configRec.host);
			this.$.port.setValue(this.configRec.port);
			this.$.type.setValue(this.configRec.type);
			this.$.uid.setValue(this.configRec.user);
			this.$.pass.setValue(this.configRec.pass);
			
			this.$.locdir.setValue(this.configRec.locDir);
			this.$.remdir.setValue(this.configRec.remDir);
			
			this.showGeneral();
		}
	},
	showGeneral: function(inHost) {
		this.$.radioGroup.setValue("general");
		this.$.drawerPane.selectViewByName("general");
	},
	showAdvanced: function() {
		this.$.radioGroup.setValue("advanced");
		this.$.drawerPane.selectViewByName("advanced");
	}
});